<template>
  <a-modal :visible="visible" :width="1100" title="报价流程" :footer="null" destroyOnClose @cancel="handleCloseDialog">
    <a-spin :spinning="spinning">
      <a-steps :current="curStep" size="small" style="margin-bottom: 20px;" @change="handleChangeStep">
        <a-step v-for="item in showList" :key="item" :title="item"> </a-step>
      </a-steps>
      <a-form-model ref="ruleForm" :model="quotationFormData" :rules="rules">
        <a-row :gutter="20" v-if="curStep === 0" class="hh_row">
          <a-col :span="8">
            <a-form-model-item label="套餐类型" prop="packageType">
              <j-dict-select-tag
                v-model="quotationFormData.packageType"
                placeholder="请选择套餐类型"
                dictCode="package_type"
                :disabled="status !== 'operate'"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="8">
            <a-form-model-item label="固定部分用电量占比（%）" prop="proportionElectricityConsumption">
              <a-input-number
                @change="handleNumInput(arguments[0], 'proportionElectricityConsumption')"
                style="width: 100%;"
                v-model="quotationFormData.proportionElectricityConsumption"
                placeholder="请输入固定部分用电量占比"
                :disabled="status !== 'operate' || disabledInputNum('proportionElectricityConsumption')"
                :max="100"
                :min="0"
                :precision="2"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="8">
            <a-form-model-item label="固定部分平段价格（厘/KW·h）" prop="fixedPriceSections">
              <a-input
                style="width: 100%;"
                v-model="quotationFormData.fixedPriceSections"
                placeholder="请输入固定部分平段价格"
                :disabled="status !== 'operate'"
              />
            </a-form-model-item>
          </a-col>
          <!-- <a-col :span="8">
            <a-form-model-item label="联动1电价类型" prop="linkage1ElectricityPriceType">
              <j-dict-select-tag
                v-model="quotationFormData.linkage1ElectricityPriceType"
                placeholder="请选择联动1电价类型"
                dictCode="linkage_electricity_price_type"
                :disabled="status !== 'operate'"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="8">
            <a-form-model-item label="联动1用电量占比（%）" prop="proportion1ConsumptionLinkage">
              <a-input-number
                @change="handleNumInput(arguments[0], 'proportion1ConsumptionLinkage')"
                :max="100"
                :min="0"
                :precision="2"
                style="width: 100%;"
                v-model="quotationFormData.proportion1ConsumptionLinkage"
                placeholder="请输入联动1用电量占比"
                :disabled="status !== 'operate' || disabledInputNum('proportion1ConsumptionLinkage')"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="8">
            <a-form-model-item label="联动2电价类型" prop="linkage2ElectricityPriceType">
              <j-dict-select-tag
                v-model="quotationFormData.linkage2ElectricityPriceType"
                placeholder="请选择联动2电价类型"
                dictCode="linkage_electricity_price_type"
                :disabled="status !== 'operate'"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="8">
            <a-form-model-item label="联动2用电量占比（%）" prop="proportion2ConsumptionLinkage">
              <a-input-number
                @change="handleNumInput(arguments[0], 'proportion2ConsumptionLinkage')"
                style="width: 100%;"
                :max="100"
                :min="0"
                :precision="2"
                v-model="quotationFormData.proportion2ConsumptionLinkage"
                placeholder="请输入联动2用电量占比"
                :disabled="status !== 'operate' || disabledInputNum('proportion2ConsumptionLinkage')"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="8">
            <a-form-model-item label="联动3电价类型" prop="linkage3ElectricityPriceType">
              <j-dict-select-tag
                v-model="quotationFormData.linkage3ElectricityPriceType"
                placeholder="请选择联动3电价类型"
                dictCode="linkage_electricity_price_type"
                :disabled="status !== 'operate'"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="8">
            <a-form-model-item label="联动3用电量占比（%）" prop="proportion3ConsumptionLinkage">
              <a-input-number
                @change="handleNumInput(arguments[0], 'proportion3ConsumptionLinkage')"
                :max="100"
                :min="0"
                :precision="2"
                style="width: 100%;"
                v-model="quotationFormData.proportion3ConsumptionLinkage"
                placeholder="请输入联动3用电量占比"
                :disabled="status !== 'operate' || disabledInputNum('proportion3ConsumptionLinkage')"
              />
            </a-form-model-item>
          </a-col> -->
          <a-col :span="8">
            <a-form-model-item label="市场联动电量占比（%）" prop="proportion1ConsumptionLinkage">
              <a-input-number
                style="width: 100%;"
                :max="100"
                :min="0"
                :precision="2"
                @change="handleNumInput(arguments[0], 'proportion1ConsumptionLinkage')"
                v-model="quotationFormData.proportion1ConsumptionLinkage"
                placeholder="请输入市场联动电量占比"
                :disabled="status !== 'operate' || disabledInputNum('proportion1ConsumptionLinkage')"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="8">
            <a-form-model-item label="市场联动价格类型（平段）" prop="linkage1ElectricityPriceType">
              <j-dict-select-tag
                v-model="quotationFormData.linkage1ElectricityPriceType"
                placeholder="请选择联动1电价类型"
                dictCode="linkage_electricity_price_type"
                :disabled="status !== 'operate'"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="8">
            <a-form-model-item label="服务费按实际用电量占比（%）" prop="proportion2ConsumptionLinkage">
              <a-input-number
                :min="0"
                :max="100"
                style="width: 100%;"
                v-model="quotationFormData.proportion2ConsumptionLinkage"
                placeholder="请输入服务费按实际用电量占比"
                :disabled="status !== 'operate'"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="8">
            <a-form-model-item label="服务费单价（厘/KW·h）" prop="serviceFeeUnitPrice">
              <a-input
                :min="0"
                style="width: 100%;"
                v-model="quotationFormData.serviceFeeUnitPrice"
                placeholder="请输入服务费单价"
                :disabled="status !== 'operate'"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="8">
            <a-form-model-item label="需求侧响应代理" prop="demandSideResponseAgent">
              <j-dict-select-tag
                v-model="quotationFormData.demandSideResponseAgent"
                placeholder="请选择需求侧响应代理"
                dictCode="gz_agree"
                disabled
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="8">
            <a-form-model-item label="需求侧响应甲方收益分成比例（%）" prop="demandSideResponsePartyRatio">
              <a-input-number
                :max="100"
                :min="0"
                style="width: 100%;"
                v-model="quotationFormData.demandSideResponsePartyRatio"
                placeholder="请输入需求侧响应甲方收益分成比例"
                :disabled="status !== 'operate'"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="8">
            <a-form-model-item label="合同开始时间" prop="contractStartTime">
              <a-date-picker v-model="quotationFormData.contractStartTime" valueFormat="YYYY-MM-DD" :disabled="status !== 'operate'" />
            </a-form-model-item>
          </a-col>
          <a-col :span="8">
            <a-form-model-item label="合同结束时间" prop="contractEndTime">
              <a-date-picker v-model="quotationFormData.contractEndTime" valueFormat="YYYY-MM-DD" :disabled="status !== 'operate'" />
            </a-form-model-item>
          </a-col>
          <a-col :span="8">
            <a-form-model-item label="报价单有效期" prop="validityPeriodQuotation">
              <a-date-picker
                v-model="quotationFormData.validityPeriodQuotation"
                valueFormat="YYYY-MM-DD"
                :disabled="status !== 'operate'"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="8">
            <a-form-model-item label="报价单是否盖章" prop="isQuotationStamped">
              <a-radio-group
                name="radioGroup"
                :default-value="1"
                v-model="quotationFormData.isQuotationStamped"
                :disabled="status !== 'operate'"
              >
                <a-radio value="1">
                  是
                </a-radio>
                <a-radio value="2">
                  否
                </a-radio>
              </a-radio-group>
            </a-form-model-item>
          </a-col>
          <a-col :span="8">
            <a-form-model-item label="条款是否修改" prop="clauseModification">
              <a-radio-group
                name="radioGroup"
                :default-value="1"
                v-model="quotationFormData.clauseModification"
                :disabled="status !== 'operate'"
              >
                <a-radio value="1">
                  是
                </a-radio>
                <a-radio value="2">
                  否
                </a-radio>
              </a-radio-group>
            </a-form-model-item>
          </a-col>
          <a-col :span="8" v-if="quotationFormData.clauseModification === '1'">
            <a-form-model-item label="修改内容" prop="clauseModificationContent">
              <a-input
                placeholder="请输入修改内容"
                v-model="quotationFormData.clauseModificationContent"
                :disabled="status !== 'operate'"
              />
            </a-form-model-item>
          </a-col>
        </a-row>
        <div v-show="curStep === 1">
          <component ref="step2Com" :is="type === '3' ? 'AgentForm' : 'SalesmanForm'" :status="status"></component>
        </div>
        <div v-show="curStep === 2">
          <component ref="step3Com" :is="type === '3' ? 'SalesmanForm' : 'AgentForm'" :status="status"></component>
        </div>
      </a-form-model>
      <a-form-model
        ref="approveFormRef"
        :model="approveFormData"
        v-if="curStep === showList.length - 1 && status !== 'operate'"
      >
        <a-row>
          <a-col :span="10">
            <a-form-model-item
              prop="isPass"
              label="审批状态"
              :labelCol="{ span: 8, offset: 1 }"
              :wrapperCol="{ span: 15 }"
              :rules="{
                required: true,
                message: '请选择审批状态'
              }"
            >
              <j-dict-select-tag
                type="list"
                v-model="approveFormData.isPass"
                dictCode="bj_approve_status"
                placeholder="请选择审核意见"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="10">
            <a-form-model-item
              label="审核意见"
              prop="reviewComments"
              :labelCol="{ span: 8, offset: 1 }"
              :wrapperCol="{ span: 15 }"
              :rules="{
                required: approveFormData.isPass === '2',
                message: '请输入审核意见',
                trigget: 'blur'
              }"
            >
              <a-input
                type="textarea"
                v-model="approveFormData.reviewComments"
                placeholder="请输入审核意见"
                :maxLength="200"
              />
            </a-form-model-item>
          </a-col>
        </a-row>
      </a-form-model>
      <div class="btn_box">
        <a-button v-if="curStep === 0" type="primary" @click="oneStepNext">下一步</a-button>
        <a-button
          v-if="curStep === 1 && status === 'operate'"
          type="primary"
          style="margin-right: 10px"
          :loading="subBtnLoadding"
          @click="twoStepSubmit"
          >提交</a-button
        >
        <a-button v-if="curStep === 1 && showList.length > 2" type="primary" @click="twoStepNext">下一步</a-button>
        <a-button
          v-if="curStep === 2 && status === 'operate'"
          type="primary"
          style="margin-right: 10px"
          :loading="subBtnLoadding"
          @click="threeStepSubmit"
          >提交</a-button
        >
        <a-button
          v-if="status === 'approve' && curStep === showList.length - 1"
          type="primary"
          style="margin-right: 10px"
          :loading="subBtnLoadding"
          @click="handleApprove"
          >审批</a-button
        >
        <a-button
          v-if="status === 'reApprove' && curStep === showList.length - 1"
          type="primary"
          style="margin-right: 10px"
          :loading="subBtnLoadding"
          @click="handleApprove"
          >审批复核</a-button
        >
      </div>
    </a-spin>
  </a-modal>
</template>

<script>
import SalesmanForm from './SalesmanForm.vue'
import AgentForm from './AgentForm.vue'
import { apiAddQuotation, apiEditQuotation, apiGetQuotationDetailById } from '@/api/agentManage'
import { apiApprove, apiReApprove } from '@/api/agentManage'

export default {
  name: 'QuotationModal',
  components: { SalesmanForm, AgentForm },
  props: {
    type: String, // 1为代理商，不是1都走业务员流程
    customId: String,
    packagePriceId: String,
    submitAfter: Function,
    status: String // approve:审核 operate:可编辑的操作（新增修改）
  },
  data() {
    return {
      quotationFormData: {
        demandSideResponseAgent: '1',
        clauseModification: '2',
        isQuotationStamped: '2',
        proportionElectricityConsumption: 0.0,
        proportion1ConsumptionLinkage: 0.0
      },
      curStep: 0,
      visible: false,
      showList: ['套餐信息', '业务员业绩分配', '代理商收益分配'],
      rules: {
        packageType: [{ required: true, message: '请选择代理商', trigger: 'change' }],
        proportionElectricityConsumption: [
          { required: true, message: '请输入固定部分用电量占比', trigger: 'blur' }
        ],
        fixedPriceSections: [{ required: true, message: '请输入固定部分平段价格', trigger: 'blur' }],
        linkage1ElectricityPriceType: [{ required: true, message: '请选择联动1电价类型', trigger: 'change' }],
        proportion1ConsumptionLinkage: [
          { required: true, message: '请输入联动1用电量占比', trigger: 'blur' }
        ],
        linkage2ElectricityPriceType: [{ required: true, message: '请选择联动2电价类型', trigger: 'change' }],
        proportion2ConsumptionLinkage: [
          { required: true, message: '请输入服务费按实际用电量占比（%）', trigger: 'blur' }
        ],
        linkage3ElectricityPriceType: [{ required: true, message: '请选择联动3电价类型', trigger: 'change' }],
        proportion3ConsumptionLinkage: [
          { type: 'number', required: true, message: '请输入联动3用电量占比', trigger: 'blur' }
        ],
        serviceFeeUnitPrice: [{ required: true, message: '请输入服务费单价', trigger: 'change' }],
        demandSideResponseAgent: [{ required: true, message: '请选择需求侧响应代理', trigger: 'change' }],
        demandSideResponsePartyRatio: [
          { required: true, message: '请输入需求侧响应甲方收益分成比例', trigger: 'change' }
        ],
        contractStartTime: [{ required: true, message: '请选择合同开始时间', trigger: 'change' }],
        contractEndTime: [{ required: true, message: '请选择合同结束时间', trigger: 'change' }],
        validityPeriodQuotation: [{ required: true, message: '请选择报价单有效期', trigger: 'change' }],
        isQuotationStamped: [{ required: true, message: '请选择报价单是否盖章', trigger: 'change' }],
        clauseModification: [{ required: true, message: '请选择合同是否修改', trigger: 'change' }]
      },
      subBtnLoadding: false,
      spinning: false,
      approveFormData: {
        isPass: '1',
        reviewComments: ''
      }
    }
  },
  methods: {
    async oneStepNext() {
      const res = await this.$refs.ruleForm.validate()
      this.curStep = 1
    },
    async twoStepSubmit() {
      const list = await this.$refs.step2Com.validateForm()
      const msg = this.type === '3' ? '业务员业绩分配' : '代理商收益分配'
      this.$confirm({
        title: '提示',
        content: `此处提交不包含${msg}的数据信息，是否确认提交？`,
        onOk: async () => {
          if (this.type === '3') {
            list.map((item, index) => {
              this.quotationFormData[`agency${index + 1}FixedBatteryMinimumPrice`] =
                item['agencyFixedBatteryMinimumPrice']
              this.quotationFormData[`agency${index + 1}FixedPowerRatio`] = item['agencyFixedPowerRatio']
              this.quotationFormData[`agency${index + 1}FloatingBatteryMinimumPrice`] =
                item['agencyFloatingBatteryMinimumPrice']
              this.quotationFormData[`agency${index + 1}Name`] = item['agencyName']
              this.quotationFormData[`agency${index + 1}PackageType`] = item['agencyPackageType']
              this.quotationFormData[`agency${index + 1}ResponseRevenueSharingRatio`] =
                item['agencyResponseRevenueSharingRatio']
            })
            ;[(1, 2, 3)].map((item, index) => {
              this.quotationFormData[`salesperson${index + 1}Name`] = undefined
              this.quotationFormData[`electricity${index + 1}Ratio`] = undefined
            })
          } else {
            list.map((item, index) => {
              this.quotationFormData[`salesperson${index + 1}Name`] = item['salespersonName']
              this.quotationFormData[`electricity${index + 1}Ratio`] = item['electricityRatio']
            })
            ;[(1, 2)].map((item, index) => {
              this.quotationFormData[`agency${index + 1}FixedBatteryMinimumPrice`] = undefined
              this.quotationFormData[`agency${index + 1}FixedPowerRatio`] = undefined
              this.quotationFormData[`agency${index + 1}FloatingBatteryMinimumPrice`] = undefined
              this.quotationFormData[`agency${index + 1}Name`] = undefined
              this.quotationFormData[`agency${index + 1}PackageType`] = undefined
              this.quotationFormData[`agency${index + 1}ResponseRevenueSharingRatio`] = undefined
            })
          }
          this.subBtnLoadding = true
          const apiFun = this.packagePriceId ? apiEditQuotation : apiAddQuotation
          const { code, data } = await apiFun({ ...this.quotationFormData, customId: this.customId })
          this.subBtnLoadding = false
          if (code === 200) {
            this.submitAfter && this.submitAfter()
            this.$message.success('操作成功！')
            this.handleCloseDialog()
          }
        }
      })
    },
    async twoStepNext() {
      const res = await this.$refs.step2Com.validateForm()
      this.curStep = 2
    },
    async threeStepSubmit() {
      const stepList2 = await this.$refs.step2Com.validateForm()
      const stepList3 = await this.$refs.step3Com.validateForm()
      // 根据对象属性判断哪个步骤
      if (stepList2[0]['salespersonName']) {
        stepList2.map((item, index) => {
          this.quotationFormData[`salesperson${index + 1}Name`] = item['salespersonName']
          this.quotationFormData[`electricity${index + 1}Ratio`] = item['electricityRatio']
        })
        stepList3.map((item, index) => {
          this.quotationFormData[`agency${index + 1}FixedBatteryMinimumPrice`] = item['agencyFixedBatteryMinimumPrice']
          this.quotationFormData[`agency${index + 1}FixedPowerRatio`] = item['agencyFixedPowerRatio']
          this.quotationFormData[`agency${index + 1}FloatingBatteryMinimumPrice`] =
            item['agencyFloatingBatteryMinimumPrice']
          this.quotationFormData[`agency${index + 1}Name`] = item['agencyName']
          this.quotationFormData[`agency${index + 1}PackageType`] = item['agencyPackageType']
          this.quotationFormData[`agency${index + 1}ResponseRevenueSharingRatio`] =
            item['agencyResponseRevenueSharingRatio']
        })
      } else {
        stepList3.map((item, index) => {
          this.quotationFormData[`salesperson${index + 1}Name`] = item['salespersonName']
          this.quotationFormData[`electricity${index + 1}Ratio`] = item['electricityRatio']
        })
        stepList2.map((item, index) => {
          this.quotationFormData[`agency${index + 1}FixedBatteryMinimumPrice`] = item['agencyFixedBatteryMinimumPrice']
          this.quotationFormData[`agency${index + 1}FixedPowerRatio`] = item['agencyFixedPowerRatio']
          this.quotationFormData[`agency${index + 1}FloatingBatteryMinimumPrice`] =
            item['agencyFloatingBatteryMinimumPrice']
          this.quotationFormData[`agency${index + 1}Name`] = item['agencyName']
          this.quotationFormData[`agency${index + 1}PackageType`] = item['agencyPackageType']
          this.quotationFormData[`agency${index + 1}ResponseRevenueSharingRatio`] =
            item['agencyResponseRevenueSharingRatio']
        })
      }
      this.subBtnLoadding = true
      const apiFun = this.packagePriceId ? apiEditQuotation : apiAddQuotation
      const { code, data } = await apiFun({ ...this.quotationFormData, customId: this.customId })
      this.subBtnLoadding = false
      if (code === 200) {
        this.$message.success('操作成功！')
        this.handleCloseDialog()
        this.submitAfter && this.submitAfter()
      }
    },
    handleCloseDialog() {
      this.visible = false
      this.curStep = 0
      this.quotationFormData = {
        demandSideResponseAgent: '1',
        clauseModification: '2',
        isQuotationStamped: '2',
        proportionElectricityConsumption: 0.0,
        proportion1ConsumptionLinkage: 0.0
      }
      this.approveFormData = {
        isPass: '1',
        reviewComments: ''
      }
    },
    // 四个固定值加起来不能超过100
    handleNumInput(num, type) {
      const fieldList = ['proportionElectricityConsumption', 'proportion1ConsumptionLinkage']
      const filterFieldSum =
        fieldList
          .filter(item => item !== type)
          .reduce((pre, next) => {
            let num = Number(this.quotationFormData[next]) * 100 || 0
            return (num += pre)
          }, 0) / 100
      if (filterFieldSum === 100) {
        this.quotationFormData[type] = 0.0
        return
      }
      if (filterFieldSum + num > 100) {
        this.quotationFormData[type] = 100 - filterFieldSum
        return
      }
    },
    // 禁用数字输入框
    disabledInputNum(type) {
      const fieldList = ['proportionElectricityConsumption', 'proportion1ConsumptionLinkage']
      const filterFieldSum =
        fieldList
          .filter(item => item !== type)
          .reduce((pre, next) => {
            let num = Number(this.quotationFormData[next]) * 100 || 0
            return (num += pre)
          }, 0) / 100
      console.log(filterFieldSum, 'filterFieldSum', Number(this.quotationFormData[type]) == 0)

      if (filterFieldSum >= 100 && Number(this.quotationFormData[type]) == 0) {
        return true
      }
    },
    // 获取详情
    async getDetail() {
      this.spinning = true
      console.log(this.packagePriceId, 'packagePriceId');
      
      const { code, result } = await apiGetQuotationDetailById(this.packagePriceId)
      this.spinning = false
      if (code === 200) {
        this.quotationFormData = result
        let agentFormList = []
        if (result.agency1Name) {
          agentFormList.push({
            agencyName: result.agency1Name,
            agencyPackageType: result.agency1PackageType,
            agencyFixedPowerRatio: result.agency1FixedPowerRatio,
            agencyFixedBatteryMinimumPrice: result.agency1FixedBatteryMinimumPrice,
            agencyFloatingBatteryMinimumPrice: result.agency1FloatingBatteryMinimumPrice,
            agencyResponseRevenueSharingRatio: result.agency1ResponseRevenueSharingRatio
          })
        } else {
          if (this.type !== '3' && this.status !== 'operate') {
            this.showList = ['套餐信息', '业务员业绩分配']
          }
          // 设置默认值
          agentFormList.push({
            agencyName: undefined,
            agencyPackageType: undefined,
            agencyFixedPowerRatio: undefined,
            agencyFixedBatteryMinimumPrice: undefined,
            agencyFloatingBatteryMinimumPrice: undefined,
            agencyResponseRevenueSharingRatio: undefined
          })
        }
        if (result.agency2Name) {
          agentFormList.push({
            agencyName: result.agency2Name,
            agencyPackageType: result.agency2PackageType,
            agencyFixedPowerRatio: result.agency2FixedPowerRatio,
            agencyFixedBatteryMinimumPrice: result.agency2FixedBatteryMinimumPrice,
            agencyFloatingBatteryMinimumPrice: result.agency2FloatingBatteryMinimumPrice,
            agencyResponseRevenueSharingRatio: result.agency2ResponseRevenueSharingRatio
          })
        }
        let salesmanFormList = []
        if (result.salesperson1Name) {
          salesmanFormList.push({
            salespersonName: result.salesperson1Name,
            electricityRatio: result.electricity1Ratio
          })
        } else {
          if (this.type === '3' && this.status !== 'operate') {
            this.showList = ['套餐信息', '代理商收益分配']
          }
          salesmanFormList.push({
            salespersonName: undefined,
            electricityRatio: undefined
          })
        }
        if (result.salesperson2Name) {
          salesmanFormList.push({
            salespersonName: result.salesperson2Name,
            electricityRatio: result.electricity2Ratio
          })
        }
        if (result.salesperson3Name) {
          salesmanFormList.push({
            salespersonName: result.salesperson3Name,
            electricityRatio: result.electricity3Ratio
          })
        }
        if (this.type === '3') {
          this.$refs.step2Com.formList = agentFormList
          this.$refs.step3Com.formList = salesmanFormList
        } else {
          this.$refs.step2Com.formList = salesmanFormList
          this.$refs.step3Com.formList = agentFormList
        }
      }
    },
    // 修改步骤
    async handleChangeStep(val) {
      if (this.curStep === 0) {
        await this.$refs.ruleForm.validate()
      } else if (this.curStep === 1) {
        await this.$refs.step2Com.validateForm()
      }
      const attr = this.type === '3' ? 'agencyName' : 'salespersonName'
      const msg = this.type === '3' ? '代理商收益分配！' : '业务员业绩分配！'
      if (val === 2 && !this.$refs.step2Com.formList[0][attr]) {
        this.$message.warning('请先填写' + msg)
        return
      }
      this.curStep = val
    },
    // 审批 type 1为审核，2为复核
    async handleApprove() {
      const apiFun = this.status === 'approve' ? apiApprove : apiReApprove
      const params = { ...this.approveFormData, id: this.customId }
      await this.$refs.approveFormRef.validate()
      this.subBtnLoadding = true
      const { code, message } = await apiFun(params)
      this.subBtnLoadding = false
      if (code === 200) {
        this.handleCloseDialog()
        this.submitAfter && this.submitAfter()
        this.$message.success('操作成功！')
      } else {
        this.$message.error(message)
      }
    }
  },
  watch: {
    visible: {
      handler(newV) {
        if (newV) {
          if (this.type === '3') {
            this.showList = ['套餐信息', '代理商收益分配', '业务员业绩分配']
          } else {
            this.showList = ['套餐信息', '业务员业绩分配', '代理商收益分配']
          }
          this.getDetail()
        }
      },
      immediate: true
    },
    'quotationFormData.clauseModification'(newV) {
      if (newV === '2') {
        this.quotationFormData.clauseModificationContent = undefined
      }
    }
  }
}
</script>

<style lang="less" scoped>
::v-deep {
  .ant-calendar-picker {
    width: 100%;
  }
}
.btn_box {
  padding-top: 20px;
  text-align: right;
}
::v-deep {
  .hh_row {
    .ant-form-item-label {
      line-height: normal;
    }
  }
}
</style>
